// ById
function D(id) {
    return document.getElementById(id);
}

// var _contact_list = [];
// for (var i = 0; i < 5000; i++) {
//     var item = {
//         id: 1,
//         avartar: './assets/images/36d55e28202ceba349998477f2597eef.jpg',
//         nickname: '张三',
//         cont: '输了你赢了世界又如何',
//         unread: false,
//         create_time: new Date().getTime()
//     };
//     _contact_list.push(item)
// }

window.onload = function () {
    // renderContactList();

    // initBindClick();

    // initGroupHover();

    // initSearchResultHover();

    // const viewer = new Viewer(document.getElementById('large_img'), {
    //     inline: false,
    //     viewed() {
    //         viewer.zoomTo(1);
    //     },
    // });

    //获取最近联系人列表
    getRelatedList();
}

//初始化交互
function initAjax(msg) {
    var event = document.createEvent('MessageEvent');
    var origin = window.location.protocol + '//' + window.location.host;
    event.initMessageEvent('MessageReceived', true, true, msg, origin, 1234, window, null);
    document.dispatchEvent(event);
}
//接收消息事件
function messageReceived(res) {
    // alert(res)
    res = JSON.parse(res);
    if (res.code == 100) {
        var data = res.data;
        //最近联系人
        if (res.type == 'RecentContacts/GetList') {
            getRelatedListCallback(data);
        }
    } else {

    }
}

//获取最近联系人列表
function getRelatedList() {
    var number = 50;
    var data_opt = {
        type: "RecentContacts/GetList",
        data: {
            robot_name: "xf",
            number: number
        }
    }
    data_opt = JSON.stringify(data_opt);
    initAjax(data_opt);
}

//获取最近联系人列表--回调
function getRelatedListCallback(data) {
    // alert(data)
    var html = '';
    for (var i in data) {
        var item = data[i];
        html += '<div class="u-item" style="top:' + (i * 70) + 'px" data-id="' + item.ID + '">';
        html += '<div class="avatar" data-id="' + item.ID + '" onclick="viewDetail(this)">';
        html += '<img src="' + item.heardpic + '" alt="">';
        html += '<div class="unread" style="display:' + (item.unread == 0 ? "none" : "block") + '">' + item.unread + '</div>';
        html += '</div>';
        html += '<div class="info" data-id="' + item.ID + '">';
        html += '<p>';
        html += '<span class="nickname ellipsis">' + item.usernick + '</span>';
        html += '<span class="time">' + (tool.formatDate('hh:ii', (item.lastline))) + '</span>';
        html += '</p>';
        html += '<p class="ellipsis">';
        html += '<span>' + item.content + '</span>';
        html += '<span class="circle ' + (item.unread == 0 ? "hide" : "") + '"></span>';
        html += '</p>';
        html += '</div>';
        html += '</div>';
    }
    document.getElementById("dropView").innerHTML = html;
}

// 加载用户列表
function renderContactList() {
    var html = '';
    for (var i in contact_list) {
        var item = contact_list[i];
        html += '<div class="u-item" style="top:' + (i * 70) + 'px" data-id="' + item.id + '">';
        html += '<div class="avatar" data-id="' + item.id + '" onclick="viewDetail(this)">';
        html += '<img src="' + item.avartar + '" alt="">';
        html += '<div class="unread" style="display:' + (item.unread == false ? "none" : "block") + '">' + parseInt(Math.random() * 100) + '</div>';
        html += '</div>';
        html += '<div class="info" data-id="' + item.id + '">';
        html += '<p>';
        html += '<span class="nickname ellipsis">' + item.nickname + '</span>';
        html += '<span class="time">' + (tool.formatDate('hh:ii', (item.create_time))) + '</span>';
        html += '</p>';
        html += '<p class="ellipsis">';
        html += '<span>' + item.cont + '撒飞洒发沙发撒飞洒发' + '</span>';
        html += '<span class="circle ' + (item.unread == false ? "hide" : "") + '"></span>';
        html += '</p>';
        html += '</div>';
        html += '</div>';
    }
    document.getElementById("dropView").innerHTML = html;
}

//搜索联系人--搜索
function searchContacts(val) {
    // console.log(val)
    if (val !== '' && val == 'no') {
        D('sch-res').style.display = 'none';
        D('no-res').style.display = 'block';
    } else if (val !== '' && val != 'no') {
        D('no-res').style.display = 'none';
        D('sch-res').style.display = 'block';
    } else {
        D('no-res').style.display = 'none';
        D('sch-res').style.display = 'none';
    }
}

//搜索联系人--失去焦点隐藏搜索结果框
function hideSchRes() {
    D('sch-ipt').value = '';
    D('no-res').style.display = 'none';
    D('sch-res').style.display = 'none';
}

//搜索联系人--hover
function initSearchResultHover() {
    var doms = document.getElementsByClassName("sch-res-item");
    for (var i = 0; i < doms.length; i++) {
        //click
        doms[i].onclick = function () {
            D('sch-ipt').value = '';
            D('sch-res').style.display = 'none';
        }

        //mouseenter
        doms[i].onmouseenter = function () {
            var $tar = $(this);
            $tar.addClass('hover');
        }

        //mouseleave
        doms[i].onmouseleave = function () {
            var $tar = $(this);
            $tar.removeClass('hover');
        }
    }
}

//点击查看消息内容
function initBindClick() {
    var doms = document.getElementsByClassName("info");
    for (var i = 0; i < doms.length; i++) {
        //click
        doms[i].onclick = function () {
            var $tar = $(this).parent();
            if (!$tar.hasClass("active")) {
                $tar.addClass("active");
                $tar.siblings().removeClass("active");
                $tar.siblings().removeClass("hover");
                $tar.find('.unread')[0].style.display = "none";
                this.getElementsByClassName("circle")[0].style.display = "none";
                // this.getElementsByClassName("unread")[0].style.display = "none";
            }
            var id = this.getAttribute("data-id");
            console.log(id)
            // document.getElementById("iframe").src = "./chat.html?id=" + id;
        }

        //mouseenter
        doms[i].onmouseenter = function () {
            var $tar = $(this).parent();
            if (!$tar.hasClass("active")) {
                $tar.addClass('hover');
            }
        }

        //mouseleave
        doms[i].onmouseleave = function () {
            var $tar = $(this).parent();
            if (!$tar.hasClass("active")) {
                $tar.removeClass('hover');
            }
        }

    }
}

//联系人分组 -- hover
function initGroupHover() {
    var groupDoms = document.getElementsByClassName("info-base");
    for (let i = 0; i < groupDoms.length; i++) {
        //click
        groupDoms[i].onclick = function () {
            var $tar = $(this).parent();
            if (!$tar.hasClass("active")) {
                $tar.addClass("active");
                for (let j = 0; j < groupDoms.length; j++) {
                    if (i != j) {
                        groupDoms[j].parentElement.classList.remove('active');
                        groupDoms[j].parentElement.classList.remove('hover');
                    }
                }
            }
        }

        //mouseenter
        groupDoms[i].onmouseenter = function () {
            var $tar = $(this).parent();
            if (!$tar.hasClass("active")) {
                $tar.addClass('hover');
            }
        }

        //mouseleave
        groupDoms[i].onmouseleave = function () {
            var $tar = $(this).parent();
            if (!$tar.hasClass("active")) {
                $tar.removeClass('hover');
            }
        }
    }
}

//点击头像查看用户详情
function viewDetail(e) {
    var id = e.getAttribute("data-id");
    window.open("./html/detail.html?id=" + id);
}

//新消息置顶
function newMsg(id) {
    //获取新消息下标
    var idx = 0;
    for (var i in contact_list) {
        if (contact_list[i].id == id) {
            idx = i;
        }
    }
    //遍历联系人列表
    var doms = document.getElementsByClassName("u-item");
    //先将新消息ID置顶
    doms[idx].style.top = 0;
    //其余往下顺移位置
    for (var i = 0; i < idx; i++) {
        doms[i].style.top = (i + 1) * 70 + 'px';
    }
}

//定位到未读消息
var click_time = 0;
function findUnread() {

    //查找未读消息，保存至数组
    var unread_list = [];
    for (var i in contact_list) {
        if (contact_list[i].unread) {
            unread_list.push(i);
        }
    }

    //滚动框DOM
    var scrollDom = document.getElementById("dropView");

    //设置scrollTop的值
    if (unread_list.length !== 0 && unread_list[click_time]) {
        //未读消息在消息列表的索引值
        var idx = unread_list[click_time];
        scrollDom.scrollTop = idx * 70;
        //计算点击次数
        click_time += 1;
    }
}

//消息记录
function handleClickViewRecord() {
    window.open("./html/history.html?id=123");
}

//发送消息
function handleClickSend() {
    var cont = CHAT_EDITOR.html();
    if (cont == '') {
        modal.tips("不能发送空白消息");
        return;
    }
    console.log(cont)
}

//选择发送模式--显示
function handleChooseModel() {
    document.getElementById("choose-model").style.display = 'block';
}

//选择发送模式--选择
$("#choose-model").on('click', 'p', function () {
    var $tar = $(this);
    if (!$tar.hasClass("active")) {
        $tar.addClass("active");
        $tar.siblings().removeClass("active");
        document.getElementById("choose-model").style.display = 'none';
    }
})

//最近联系人
function showRelated(e) {
    if (!e.classList.contains('active')) {
        e.classList.add('active');
        e.nextElementSibling.classList.remove('active');
        D('dropView').style.display = 'block';
        D('contactGroup').style.display = 'none';
    }
}

//好友列表
function showGroup(e) {
    if (!e.classList.contains('active')) {
        e.classList.add('active');
        e.previousElementSibling.classList.remove('active');
        D('dropView').style.display = 'none';
        D('contactGroup').style.display = 'block';
    }
}

//好友分组显示与隐藏
function toggleShow(memberId, e) {
    var arrow_right = e.firstElementChild;
    var arrow_bottom = arrow_right.nextElementSibling;
    if (e.classList.contains('on-active')) {
        arrow_bottom.style.display = "none";
        arrow_right.style.display = "inline";
        D(memberId).style.display = "none";
        //切换样式
        e.classList.toggle('on-active');
    } else {
        arrow_bottom.style.display = "inline";
        arrow_right.style.display = "none";
        D(memberId).style.display = "block";
        //切换样式
        e.classList.toggle('on-active');
    }
}

//快捷回复--tab切换
function showQuickReply(e) {
    if (!e.classList.contains('active')) {
        e.classList.add('active');
        e.nextElementSibling.classList.remove('active');
        D('quick-reply').style.display = 'block';
        D('user-detail').style.display = 'none';
    }
}

//用户详情--tab切换
function showUserDetails(e) {
    if (!e.classList.contains('active')) {
        e.classList.add('active');
        e.previousElementSibling.classList.remove('active');
        D('quick-reply').style.display = 'none';
        D('user-detail').style.display = 'block';
    }
}

// 快捷回复 -- hover + click
var quickDoms = document.getElementsByClassName("quick-item");
for (var i in quickDoms) {
    // click
    quickDoms[i].onclick = function () {
        //将快捷回复插入到光标处
        var text = this.innerText;
        CHAT_EDITOR.insertHtml(text)
    }

    //mouseenter
    quickDoms[i].onmouseenter = function () {
        // this.style.borderBottom = 'none';
        this.classList.add('active');
    }

    //mouseleave
    quickDoms[i].onmouseleave = function () {
        // this.style.borderBottom = '1px dashed #F0F0EE';
        this.classList.remove('active');
    }
}

// 个人快捷回复
function showPersonalQuick(e) {
    if (!e.classList.contains('active')) {
        e.classList.add('active');
        e.nextElementSibling.classList.remove('active');
        D('personal-quick').style.display = 'block';
        D('public-quick').style.display = 'none';
    }
}

// 公共快捷回复
function showPublicQuick(e) {
    if (!e.classList.contains('active')) {
        e.classList.add('active');
        e.previousElementSibling.classList.remove('active');
        D('personal-quick').style.display = 'none';
        D('public-quick').style.display = 'block';
    }
}

//按enter发送
function keyupSend() {
    var e = e || window.event;
    var keyCode = e.keyCode;
    console.log(keyCode)
}